<!DOCTYPE html>
<html lang="en">
    <head>
        <title>pc官网</title>
        <meta charset="utf-8">
        <!-- meta中告诉低版本的IE，要用高版本IE的渲染模式；防止低版本IE不支持CSS3的一些属性 -->
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
        <!-- 在移动设备上，页面宽度适应终端的屏幕宽度，没有滚动条，而且不能缩放 -->
        <meta name="viewport" content="width=device-width,initial-scale=1">
        <link rel="stylesheet" href="css/index.css" />
        <link rel="stylesheet" href="css/reset.css" />
        <link rel="stylesheet" href="css/swiper-4.1.6.min.css" />
    </head>
    <body>
        <div class="container">
            <!-- HOME -->
            <div class="home">
                <div class="home-header">
                    <img src="images/V.png" height="90" width="101" alt="v-logo" />
                    <ul>
                        <li><a href="#" class="active">HOME</a></li>
                        <li><a href="about.html">ABOUT</a></li>
                       <!--  <li><a href="#">SERVICE</a></li>
                       <li><a href="#">BLOG</a></li>
                       <li><a href="#">CONTACT</a></li> -->
                    </ul>
                </div>
            </div>
            <!--  ABOUT -->
            <div class="about">
                <div class="about-logo-box">
                    <img src="images/LOGO.png" height="162" width="144" alt="LOGO" />
                    <div class="logo-info">
                        <p>VTIMER</p>
                        <p>STUDIO</p>
                        <div class="line"></div>
                    </div>
                </div>
                <div class="about-Eg-msg">
                    <p>CREATIVE & PASSIONATE</p>
                    <p>We are VTMERs</p>
                </div>
                <div class="about-Ch-msg">
                    <p>维生数工作室，成立2009年，</p>
                    <p>一个有创造力和激情的学生科研团队</p>
                </div>
                <button><a href="about.html">SHOW MORE</a></button>
            </div>
        </div>
        <!-- MY WORK -->
        <div class="work">
            <div class="title">
                <p>OUR WORKS</p>
                <p>What we have done</p>
            </div>
            <div class="work-msg">
                <p>
                工作室已上线WeGDUT微信小程序，广工校医院官网，广工新生专题网，工大在线，工大乐享，广工图书馆助手插件等服务广工学子非盈利项目，同时也承接过光明牛奶官网，水密码小游戏等外包。
                </p>
            </div>
            <div class="work-works js-work-works">
            
            </div>
        </div>
        <div class="articles">
            <div class="title">
                <p>WORDS TO SAYS</p>
                <p>Articles in our Wechat official account</p>
            </div>
            <img src="images/articles-bg.png"alt="article-bg" />
            <span class="filter"></span>
            <p>我想对你说的，你看到了吗?</p>
            <div class="swiper-container">
                <div class="swiper-wrapper js-swiper-wrapper">
                 
                </div>
            </div>
              <!-- 如果需要导航按钮 -->
                <div class="swiper-button-prev"></div>
                <div class="swiper-button-next"></div>
        </div>
        <div class="footer">
            <img src="images/fooetr-img.png" height="456" width="465" alt="footer-img" />
            <p>我们以严谨的态度，追求极致的体验。让产品更加简洁和优雅。
            <br>让用户的操作自然流畅，拉近用户距离。</p>
            <div class="footer-msg-box">
                <div class="footer-msg-top">
                    <div class="footer-msg">
                    <img src="images/adress.png" height="16" width="10" alt="" class="msg-figure" />
                    <div class="msg-body">
                        <h4>Location:</h4>
                        <p>广东工业大学大学城校区</p>
                    </div>
                </div>
                <div class="footer-msg">
                     <img src="images/phone.png" height="14" width="14" alt="" class="msg-figure" />
                    <div class="msg-body">
                        <h4>TEL:</h4>
                        <p>13143381547</p>
                    </div>
                </div>
                <div class="footer-msg">
                     <img src="images/email.png" height="12" width="15" alt="" class="msg-figure" />
                    <div class="msg-body">
                        <h4>Email:</h4>
                        <p>backtoback@163.com</p>
                    </div>
                </div>
                </div>
                <p><span>VTMER</span>@2018 All Rights Reserved</p>
            </div>
        </div>
         <script>
          document.documentElement.style.fontSize = document.documentElement.clientWidth / 16 + 'px'; 
          window.onload = function() {
           
                var mySwiper = new Swiper ('.swiper-container', {
            autoplay:{disableOnInteraction:false},
            loop: true,
            slidesPerView: 3,
            // 如果需要前进后退按钮
            navigation: {
              nextEl: '.swiper-button-next',
              prevEl: '.swiper-button-prev',
            }
          })   
            }
   </script>    
        <script src="js/jquery-1.7.min.js"></script>
        <script src="js/wechatData.js"></script>
        <script src="js/ourworks.js"></script>
        <script src="js/global.js"></script>
        <script src="js/swiper-4.1.6.min.js"></script>
        
    </body>
</html>